@import "reset.css";
@import "../font/iconfont.css";
body,
html,
#page {
  height: 100%;
}
#page {
  max-width: 6.4rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
/*头部部分*/
header {
  height: 0.88rem;
  background: #0cc444;
  display: flex;
  justify-content: center;
  align-items: center;
}
header span {
  width: 1.2rem;
  height: 0.48rem;
  font-size: 0.24rem;
  background: #40d067;
  color: #a3e9b7;
  text-align: center;
  line-height: 0.48rem;
}
header span.cur {
  background: #64d985;
  color: #ffffff;
}
header span:nth-child(1) {
  border-radius: 0.3rem 0 0 0.3rem;
}
header span:nth-child(2) {
  border-radius: 0 0.3rem 0.3rem 0;
}
/*导航部分*/
nav {
  display: flex;
  height: 0.7rem;
}
nav a {
  flex: 1;
  color: #666;
  font-size: 0.28rem;
  text-align: center;
  line-height: 0.7rem;
  border-bottom: 1px solid #d9d9d9;
}
nav a.cur {
  color: #0cc444;
  border-bottom: 0.05rem solid #0cc444;
  box-sizing: border-box;
}
/*主体部分*/
main {
  overflow: auto;
}
main ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
main ul li {
  width: 49%;
  border: 1px solid #e5e5e5;
  margin-top: 0.1rem;
}
main ul li img {
  width: 100%;
}
main ul li figcaption {
  font-size: 0.24rem;
  color: #333333;
  height: 0.58rem;
  line-height: 0.58rem;
  text-align: center;
  border-top: 1px solid #e5e5e5;
}
/*尾部部分*/
footer {
  height: 0.88rem;
}
footer div {
  display: flex;
  justify-content: space-between;
  padding: 0 0.23rem 0 0.31rem;
}
footer div p:nth-child(3) {
  width: 1.06rem;
  height: 0.88rem;
  position: relative;
}
footer div p:nth-child(3) img {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
footer div p {
  font-size: 0.24rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
footer div p span {
  margin-top: 0.05rem;
  color: #dddddd;
}
footer div p i {
  color: #d1d1d2;
}
footer div p.cur i {
  color: #0cc444;
}
footer div p.cur span {
  color: #0cc444;
}
